page {
  background: #f2f3f7;
}
.page-index{
/*轮播图*/
swiper{
	width: 100%;
	height: 500rpx;
}
.swiper .swiper-img{
	width: 100%;
	height: 400rpx;
}
/*Icon*/
.Icon{
	background: rgba(255, 255, 255, 0.5);
	width: 97%;
	padding: 30rpx 0;
	margin: 10rpx;
	margin-top: -280rpx;
	margin-right:100rpx ;
	border-radius: 10rpx;
	position: absolute;
	z-index: 10; /* 确保图标在轮播图上方 */
}
.Icon .icons {
	  display: flex;
	  text-align: center;
	  padding: 0 10rpx;
	  flex-wrap: wrap;
	}
	
	
	.Icon .icons .item {
	  width: 25%;
	  margin-top: 40rpx;
	}
	
	.Icon .icons .item .img {
	  font-size: 0;
	  margin: auto;
	  width: 70rpx;
	  height: 70rpx;
	  position: relative;
	}
	.Icon .icons .item .text {
	  font-size: 26rpx;
	}
	/*特惠专区*/
	.special{
		background: #fff;
		padding: 30rpx 0;
        margin-top: 30rpx;
		border-radius: 10rpx;
	}
	.special .tit {
	  display: flex;
	  justify-content: space-between;
	  padding: 0 30rpx;
	}
	
	.special .tit .text {
	  font-weight: 600;
	  font-size: 28rpx;
	}
	
	.special .tit .more {
	  color: #999;
	}
	
	.special .tit .more.text-arrow::after {
	  font-size: 28rpx;
	  border-top: 2rpx solid #999;
	  border-right: 2rpx solid #999;
	  top: 44%;
	}
	
	.special .commodity{
		display: flex;
		text-align: center;
		padding: 0 10rpx;
		 overflow-x: auto;
		flex-wrap: wrap;
		white-space: nowrap;
		width: 100%;
	}
	
	.special .commodity .item {
	  display: inline-block;
	  width: 37%;
	  margin-top: 40rpx;
	}
	
	.special .commodity .item .img {
	  font-size: 0;
	  margin-left:10rpx ;
	  width: 250rpx;
	  height: 200rpx;
	  position: relative;
	  border-radius: 20rpx;
	  
	}
	.special .commodity .item .text {
	  font-size: 26rpx;
	}
	
	.special .commodity .item .discounted-price {
      color: red; 
	  font-size:32rpx;
      font-weight: bold;
	  float:left;
	  margin-left: 12px; 
    }
	
    .special .commodity .item .original-price {
	 font-size:15rpx;
      color: gray; 
      text-decoration: line-through; 
	  margin-top: 5rpx;
    }
	/*最新上架*/
	.latest{
		background: #fff;
		padding: 30rpx 0;

		border-radius: 10rpx;
	}
	.latest .tit {
	  display: flex;
	  justify-content: space-between;
	  padding: 0 30rpx;
	}
	
	.latest .tit .text {
	  font-weight: 600;
	  font-size: 28rpx;
	}
	
	.latest .tit .more {
	  color: #999;
	}
	
	.latest .tit .more.text-arrow::after {
	  font-size: 28rpx;
	  border-top: 2rpx solid #999;
	  border-right: 2rpx solid #999;
	  top: 44%;
	}
	
	.latest .commodity{
		display: flex;
		text-align: center;
		padding: 0 10rpx;
		 overflow-x: auto;
		flex-wrap: wrap;
		white-space: nowrap;
		width: 100%;
	}
	
	.latest .commodity .item {
	  display: inline-block;
	  width: 37%;
	  margin-top: 40rpx;
	}
	
	.latest .commodity .item .img {
	  font-size: 0;
	  margin-left:10rpx ;
	  width: 250rpx;
	  height: 200rpx;
	  position: relative;
	  border-radius: 20rpx;
	  
	}
	.latest .commodity .item .text {
	  font-size: 26rpx;
	}
	
	.latest .commodity .item .discounted-price {
	  color: red; 
	  font-size:32rpx;
	  font-weight: bold;
	  float:left;
	   margin-left: 12px; 
	}
	
	.latest .commodity .item .original-price {
	 font-size:15rpx;
	  color: gray; 
	  text-decoration: line-through; 
	  margin-top: 5rpx;
	}
	/*优宠精选*/
	.excellent{
		background: #fff;
		padding: 30rpx 0;

		border-radius: 10rpx;
	}
	.excellent .tit {
	  display: flex;
	  justify-content: space-between;
	  padding: 0 30rpx;
	}
	
	.excellent .tit .text {
	  font-weight: 600;
	  font-size: 28rpx;
	}
	
	.excellent .tit .more {
	  color: #999;
	}
	
	.excellent .tit .more.text-arrow::after {
	  font-size: 28rpx;
	  border-top: 2rpx solid #999;
	  border-right: 2rpx solid #999;
	  top: 44%;
	}
	
	.excellent .commodity{
		display: flex;
		text-align: center;
		padding: 0 10rpx;
		 overflow-x: auto;
		flex-wrap: wrap;
		white-space: nowrap;
		width: 100%;
	}
	
	.excellent .commodity .item {
	  display: inline-block;
	  width: 37%;
	  margin-top: 40rpx;
	}
	
	.excellent .commodity .item .img {
	  font-size: 0;
	  margin-left:10rpx ;
	  width: 250rpx;
	  height: 200rpx;
	  position: relative;
	  border-radius: 20rpx;
	  
	}
	.excellent .commodity .item .text {
	  font-size: 26rpx;
	}
	
	.excellent .commodity .item .discounted-price {
	  color: red; 
	  font-size:32rpx;
	  font-weight: bold;
	  float:left;
	   margin-left: 12px; 
	}
	
	.excellent .commodity .item .original-price {
	 font-size:15rpx;
	  color: gray; 
	  text-decoration: line-through; 
	  margin-top: 5rpx;
	}
	/*甄选宠物*/
	.selected{
		background: #fff;
		padding: 30rpx 0;
		border-radius: 10rpx;
	}
	.selected .tit {
	  display: flex;
	  justify-content: space-between;
	  padding: 0 30rpx;
	}
	
	.selected .tit .text {
	  font-weight: 600;
	  font-size: 28rpx;
	}
	
	.selected .tit .more {
	  color: #999;
	}
	
	.selected .tit .more.text-arrow::after {
	  font-size: 28rpx;
	  border-top: 2rpx solid #999;
	  border-right: 2rpx solid #999;
	  top: 44%;
	}
	
	.selected .commodity{
		display: flex;
		text-align: center;
		padding: 0 10rpx;
		 overflow-x: auto;
		flex-wrap: wrap;
		white-space: nowrap;
		width: 100%;
	}
	
	.selected .commodity .item {
	  display: inline-block;
	  width: 37%;
	  margin-top: 40rpx;
	}
	
	.selected .commodity .item .img {
	  font-size: 0;
	  margin-left:10rpx ;
	  width: 250rpx;
	  height: 200rpx;
	  position: relative;
	  border-radius: 20rpx;
	  
	}
	.selected .commodity .item .text {
	  font-size: 26rpx;
	}
	
	.selected .commodity .item .discounted-price {
	  color: red; 
	  font-size:32rpx;
	  font-weight: bold;
	  float:left;
	   margin-left: 12px; 
	}
	
	.selected .commodity .item .original-price {
	 font-size:15rpx;
	  color: gray; 
	  text-decoration: line-through; 
	  margin-top: 5rpx;
	}
	
	/*切换*/
	.change-box{
		background: #fff;
	}
	.change-box .nav_page .text{
		 display: flex;
	}
	
	.change-box .nav_page .text .item {
	  flex: 1 0 20%; /* 使每个元素占 20% 的宽度 */
	  text-align: center; /* 使文本居中 */
	}
   .change-box .swiper .swiper-item {
	   overflow: visible;
    }
}

// 搜索框
.search-bar{
	width: 100%;
	height: 100rpx;
	margin-top: 2%;
}
.search-bar-box{
	display: flex;
	margin: 0 auto;
	width: 500rpx;
	height: 70rpx;
	border:5rpx solid #00a8cc;
	border-radius: 50rpx;
}
.search-span{
	width: 100rpx;
	height: 56rpx;
	margin-top: 6rpx;
	margin-left: 30rpx;
}
.search-text{
	width: 100%;
	margin-top: 10rpx;
	margin-left: 20rpx;
	font-size: 30rpx;
	color: #7f7f81;
}
.search-btn{
	background-color: #00a8cc; /* Green */
	color: white;
	text-align: center;
	display: inline-block;
	font-size: 35rpx;
	width: 240rpx;
	height: 70rpx;
	line-height: 65rpx;
	border-radius: 30rpx;
	letter-spacing: 3rpx;
}
.ComBox {
		width: 690rpx; //根据微信定义设置  如非必要不建议改为100%；
		padding: 10rpx 30rpx;
		background-color: #f7f7f7;
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
		.ComList {
			//未设置高度
			width: 270rpx;
			padding: 30rpx;
			background: #fff;
			border-radius: 8rpx;
			margin-top: 30rpx;
			.ImgBOX {
				width: 270rpx;
				height: 270rpx;
				border-radius: 12rpx;
				.Img {
					width: 100%;
					height: 100%;
				}
			}
			.Title {
				width: 270rpx;
				font-size: 32rpx;
				line-height: 44rpx;
				height: 88rpx;
				padding-top: 15rpx;
				text-overflow: -o-ellipsis-lastline;
				overflow: hidden;
				text-overflow: ellipsis;
				display: -webkit-box;
				-webkit-line-clamp: 2;
				line-clamp: 2;
				-webkit-box-orient: vertical;
			}
			.Price {
				width: 100%;
				height: 44rpx;
				line-height: 44rpx;
				padding-top: 15rpx;
				font-size: 32rpx;
				font-family: PingFang SC;
				font-weight: 500;
				color: #D12324;
			}
		}
	}

   